import React from 'react';
import { Modal, Form, Input, message } from 'antd';
import Api from 'Utils/api';
import './index.scss';

const FormItem = Form.Item;
const AddForm = Form.create()(
  (props) => {
    const { form, initialValue } = props;
    const { getFieldDecorator } = form;
    return (
      <Form className="task-form">
        <FormItem
          label="密码:"
        >
          {
            getFieldDecorator('password', {
              initialValue: initialValue ? initialValue.password : '',
            })(
              <Input placeholder="请输入重置密码" style={{ width: 260 }} />
            )
          }
        </FormItem>
      </Form>
    );
  }
);
class InitialModal extends React.PureComponent {
  constructor(props) {
    super(props);

    this.state = {
      visible: false,
      loading: false,
      record: {}
    };
    this.showModal = ::this.showModal;
  }

  showModal(record) {
    this.setState({
      visible: true,
      record: record
    }, () => {
      this.form.resetFields();
    });
  }
  close() {
    this.setState({
      loading: false,
      visible: false,
    });
  }

  handleOk() {
    const formValue = this.form.getFieldsValue();
    const api = new Api({
      method: 'PUT',
      path: `/passwd/admin/${this.state.record.id}`,
      data: formValue,
      success: () => {
        this.setState({
          visible: false,
        });
      },
      error: (msg) => {
        message.error(msg);
      }
    });
    api.run();
  }

  render() {
    return (
      <div>
        <Modal
          className="add-account-modal"
          title="恢复初始密码提示"
          visible={this.state.visible}
          onOk={this.handleOk.bind(this)}
          onCancel={this.close.bind(this)}
          confirmLoading={this.state.loading}
          width={798}
          height={450}
          maskClosable={false}
        >
          <AddForm
            initialValue={this.state.record ? this.state.record : ''}
            ref={(ref) => { this.form = ref; }}
          />
        </Modal>
      </div>
    );
  }
}

export default InitialModal;
